<!--
 * @Description: 查询在修工单
 * @Autor: 何兴家
 * @Date: 2020-12-04 13:42:45
 * @LastEditors: 马毅
 * @LastEditTime: 2021-09-16 15:18:58
-->
<template>
  <div>
    <TopFilter ref="topFilter" :list="topFilterList" @filterChange="handleSearch" @onCollapse="collapseHandle"></TopFilter>
    <FilterTable
      ref="table"
      height="auto"
      :maxHeight="350"
      selectionType="single"
      :isMemoryPagination="true"
      :isColumnFilter="false"
      :columns="columns"
      :dataSource="tableDataSource"
      :datakey="'rows'"
      :onSyncTableData="handleSyncTableData"
      :onRowSelectChange="handleTableRowSelect"
      :onColumnsChange="columns => (this.columns = columns)"
    >
    </FilterTable>

    <div class="btnWrap">
      <el-button @click="handleCancel">取消</el-button>
      <el-button type="primary" @click="handleConfirm">确定</el-button>
    </div>
  </div>
</template>

<script>
import { dictionary } from '@/utils/dictMixin';
import { confirmAction, notifyAction, findFormItem, findTableItem } from '@/utils';
import dictCode from '@/utils/dictCode';

import { queryOrderList } from '@/api/repair/repairReception/customer';
import { searchRoleByCode } from '@/api/common/empSelect/index';
import { getAppId } from '@/assets/js/auth';

export default {
  mixins: [dictionary],
  data() {
    this.selectedRow = [];
    return {
      topFilterList: this.createTopFIlterList(),
      columns: this.createTableColumns(),
      tableDataSource: [], //table 数据源
      syncTableData: [] // 同步的table数据
    };
  },
  mounted() {
    this.queryServiceAdviserList();
    getAppId() == 'beijing' && (findTableItem(this.columns, 'AUDIT_RESULT').hidden = true);
    getAppId() == 'arcfox' && (findTableItem(this.columns, 'IS_SUB_ORDER').hidden = true);
  },
  methods: {
    createTopFIlterList() {
      return [
        {
          type: 'INPUT',
          label: '工单号',
          fieldName: 'roNo',
          placeholder: ''
        },
        {
          type: 'INPUT',
          label: '车牌号',
          fieldName: 'license',
          placeholder: ''
        },
        {
          type: 'SELECT',
          label: '服务顾问',
          fieldName: 'serviceAdvisor',
          placeholder: '请选择',
          itemList: []
        },
        {
          type: 'INPUT',
          label: '车主',
          fieldName: 'ownerName',
          placeholder: ''
        },
        {
          type: 'INPUT',
          label: 'VIN',
          fieldName: 'vin',
          placeholder: ''
        }
      ];
    },
    createTableColumns() {
      return [
        {
          title: '序号',
          dataIndex: 'index',
          width: 80,
          sorter: true,
          render: props => {
            return <span>{props.row.$index + 1}</span>;
          }
        },
        {
          title: '工单号',
          dataIndex: 'RO_NO',
          showOverflowTooltip: true,
          sorter: true,
          width: 130
        },
        {
          title: '维修类型',
          dataIndex: 'REPAIR_TYPE_NAME',
          sorter: true,
          showOverflowTooltip: true
        },
        {
          title: '车牌号',
          dataIndex: 'LICENSE',
          sorter: true
        },
        {
          title: 'VIN',
          dataIndex: 'VIN',
          width: 150,
          showOverflowTooltip: true,
          sorter: true
        },
        {
          title: '车主',
          dataIndex: 'OWNER_NAME',
          sorter: true,
          showOverflowTooltip: true
        },
        {
          title: '服务顾问',
          dataIndex: 'SERVICE_ADVISOR',
          sorter: true,
          showOverflowTooltip: true,
          dictItems: [],
          filter: true,
          filterType: 'checkbox',
          filterItems: []
        },
        {
          title: '开单时间',
          dataIndex: 'RO_CREATE_DATE',
          sorter: true,
          showOverflowTooltip: true,
          width: 140
        },
        {
          title: '工单状态',
          dataIndex: 'RO_STATUS',
          sorter: true,
          showOverflowTooltip: true,
          dictItems: this.createDictList(8049)
        },
        {
          title: '审核状态',
          dataIndex: 'AUDIT_RESULT',
          hidden: false
        },
        {
          title: '报修是否开单',
          dataIndex: 'IS_SUB_ORDER',
          dictItems: this.createDictList(1004),
          hidden: false
        },
        // {
        //   title: '锁定人',
        //   dataIndex: 'LOCK_USER',
        //   sorter: true,
        //   showOverflowTooltip: true,
        //   dictItems: []
        // },
        {
          title: '竣工标识',
          dataIndex: 'COMPLETE_TAG',
          sorter: true,
          filter: true,
          filterType: 'checkbox',
          filterItems: this.createDictList(1004),
          dictItems: this.createDictList(1004)
        },
        {
          title: '预交车时间',
          dataIndex: 'END_TIME_SUPPOSED',
          sorter: true,
          showOverflowTooltip: true
        }
      ];
    },
    collapseHandle() {
      this.nextTick(() => {
        this.refs.table.EXECUTE_RESET_HEIGHT();
      });
    },
    // 获取服务顾问列表
    async queryServiceAdviserList() {
      let serviceConsultant = { role: dictCode.SERVICE_CONSULTANT };
      let res = await searchRoleByCode(serviceConsultant);
      if (res.resultCode == 200) {
        let serviceAdviserDict = res.data.map(item => ({ text: item.employeeName, value: item.userId + '' }));
        findFormItem(this.topFilterList, 'serviceAdvisor').itemList = serviceAdviserDict;
        let tableTarget = findTableItem(this.columns, 'SERVICE_ADVISOR');
        tableTarget.dictItems = tableTarget.filterItems = serviceAdviserDict;
      }
    },
    // 点击搜索
    handleSearch(e) {
      this.queryTableData(e);
    },
    // 同步table数据
    handleSyncTableData(list) {
      this.syncTableData = list;
    },
    // 行项选中变化
    handleTableRowSelect(list) {
      this.selectedRow = list;
    },
    // 查询table数据
    async queryTableData(params) {
      this.$refs.table.START_LOADING();
      try {
        let res = await queryOrderList(params);
        if (res.resultCode == 200) {
          this.tableDataSource = res.data;
        }
      } catch (err) {
        console.log(err, '获取table主数据失败');
      } finally {
        this.$refs.table.STOP_LOADING();
      }
    },
    // 点击取消
    handleCancel() {
      this.$emit('close');
    },
    // 点击确定
    handleConfirm() {
      if (!this.selectedRow.length) return notifyAction('请选择需要编辑的工单', 'warning');
      this.$emit('onConfirm', this.selectedRow[0]);
    }
  }
};
</script>

<style scoped>
.btnWrap {
  position: absolute;
  left: 0px;
  bottom: 0px;
  right: 0px;
  z-index: 9;
  border-top: 1px solid rgb(233, 233, 233);
  padding: 10px 20px;
  background: rgb(255, 255, 255);
  text-align: right;
}
</style>
